<template>
  <div class="cart">
    <div class="cart-list">
      <div
        class="cart-list-item"
        v-for="item in $store.state.cart"
        :key="item.id"
      >
        <div class="cart-l">
          <van-switch v-model="item.selected" />
        </div>
        <div class="cart-r">
          <van-card
            :price="item.sell_price+'.00'"
            :title="item.title"
            :thumb="item.src"
          >
            <template #desc>
              <van-stepper v-model="item.count" />
            </template>
          </van-card>
        </div>
      </div>
    </div>

    <!-- 提交订单 -->
    <van-submit-bar
      :price="$store.getters.getAllPrice*100"
      button-text="提交订单"
    />
  </div>
</template>
<script>
export default {
  data: () => ({
    // checked: false,
    // value: 0
  })
}
</script>
<style lang="less" scoped>
.cart {
  padding: 0 10px;
  .cart-list {
    .cart-list-item {
      margin-top: 10px;
      display: flex;
      border: 1px solid #eee;
      background-color: #fafafa;
      .cart-l {
        flex: 1.5;
        display: flex;
        justify-content: center;
        align-items: center;
      }
      .cart-r {
        flex: 3.5;
        .van-stepper {
          margin-top: 12px;
        }
      }
    }
  }
}
</style>